<template>
  <div class="app-container device_setting_div" v-loading="loading" element-loading-text="拼命加载中">
    <div v-if="!DTUList.length" class="duankai_div">
      <img src="../../assets/img/duankai.png" alt="">
      <div>未连接DTU设备</div>
    </div>
    <div class="dtu_div">
      <el-button size="mini" type="primary" @click="handleDTUClick" v-if="DTUList.length">网关设置</el-button>
    </div>
    <el-tabs v-model="uuid" @tab-click="handleClick">
      <el-tab-pane v-for="item in DTUList" :key="item.uuid" :label="item.name" :name="item.uuid">
        <div class="content_div">
          <div style="
              box-sizing: border-box;
              padding: 20px;
              background: #fff;
            ">
            <div style="margin-bottom: 12px;">
              <!-- <el-button
                style="margin-right: 10px;"
                type="primary"
                :disabled="filterTableData.length == 60"
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
              >新建</el-button>-->
              <!-- <el-button size="mini" @click="handleChakan">当前网关配置</el-button> -->
            </div>
            <div class="table_div">
              <!-- @row-dblclick="handleRowDBClick" -->
              <el-table ref="multipleTable" height="calc(100vh - 280px)"
                :data="RTUList.slice((currentPage-1)*pageSize,currentPage*pageSize)" style="width: 100%"
                :cell-style="{ textAlign: 'center' }" :header-cell-style="{
                  background: 'rgba(250, 250, 250, 1)',
                  textAlign: 'center',
                }">
                <el-table-column prop="rtuIndex" label="传感器索引" width="100" />
                <el-table-column prop="rtuName" label="传感器名称" width="250px" />
                <!-- <el-table-column prop="config.totalRange" label="总量程" />
                <el-table-column prop="config.warningPositive" label="正向阈值" />
                <el-table-column prop="config.warningNegative" label="反向阈值" />
                <el-table-column prop="config.thresholdPositive" label="正向量程" />
                <el-table-column prop="config.thresholdNegative" label="反向量程" /> -->
                <el-table-column label="膨胀方向" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection == 1 ? '正' : '反'}}
                      Y：{{scope.row.config.yDirection == 1 ? '正' : '反'}}
                      Z：{{scope.row.config.zDirection == 1 ? '正' : '反'}}
                    </span>
                  </template>
                </el-table-column>
                <!-- <el-table-column prop="measuringThreshold.warningPositive" label="正向阈值" width="80" />
                <el-table-column prop="measuringThreshold.warningNegative" label="反向阈值" width="80" />
                <el-table-column prop="measuringThreshold.totalRange" label="总量程" width="80" />
                <el-table-column prop="measuringThreshold.thresholdPositive" label="正向量程" width="80" />
                <el-table-column prop="measuringThreshold.thresholdNegative" label="反向量程" width="80" /> -->
                <el-table-column label="正向阈值" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection == 1?
                      scope.row.config.xWarningPositive:scope.row.config.xThresholdPositive}}
                      Y：{{scope.row.config.yDirection == 1?
                      scope.row.config.yWarningPositive:scope.row.config.yThresholdPositive}}
                      Z：{{scope.row.config.zDirection == 1?
                      scope.row.config.zWarningPositive:scope.row.config.zThresholdPositive}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="反向阈值" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection == 1 ? scope.row.config.xThresholdNegative
                      : scope.row.config.xWarningNegative}}
                      Y：{{scope.row.config.yDirection == 1 ? scope.row.config.yThresholdNegative
                      : scope.row.config.yWarningNegative}}
                      Z：{{scope.row.config.zDirection == 1 ? scope.row.config.zThresholdNegative
                      : scope.row.config.zWarningNegative}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="总量程" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection == 1 ?(scope.row.config.xThresholdPositive
                      +
                      Math.abs(scope.row.config.xRangeNegative)):(scope.row.config.xRangePositive
                      + Math.abs(scope.row.config.xThresholdNegative))}}
                      Y：{{scope.row.config.yDirection == 1 ?(scope.row.config.yThresholdPositive
                      +
                      Math.abs(scope.row.config.yRangeNegative)):(scope.row.config.yRangePositive
                      + Math.abs(scope.row.config.yThresholdNegative))}}
                      Z：{{scope.row.config.zDirection == 1 ?(scope.row.config.zThresholdPositive
                      +
                      Math.abs(scope.row.config.zRangeNegative)):(scope.row.config.zRangePositive
                      + Math.abs(scope.row.config.zThresholdNegative))}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="正向量程" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection == 1
                      ?scope.row.config.xThresholdPositive:scope.row.config.xRangePositive}}
                      Y：{{scope.row.config.yDirection == 1
                      ?scope.row.config.yThresholdPositive:scope.row.config.yRangePositive}}
                      Z：{{scope.row.config.zDirection == 1
                      ?scope.row.config.zThresholdPositive:scope.row.config.zRangePositive}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="反向量程" width="200">
                  <template slot-scope="scope">
                    <span>
                      X：{{scope.row.config.xDirection ==
                      1?scope.row.config.xRangeNegative:scope.row.config.xThresholdNegative}}
                      Y：{{scope.row.config.yDirection ==
                      1?scope.row.config.yRangeNegative:scope.row.config.yThresholdNegative}}
                      Z：{{scope.row.config.zDirection ==
                      1?scope.row.config.zRangeNegative:scope.row.config.zThresholdNegative}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column prop="ten" label="设备状态">
                  <template slot-scope="scope">
                    <span v-if="RTUIndexOnLineList.indexOf(scope.row.rtuIndex) >= 0" style="color: #67c23a;">●在线</span>
                    <span v-else style="color: #F56C6C;">●断开</span>
                  </template>
                </el-table-column>
                <el-table-column prop="config.rfChannel" label="射频信道" />
                <el-table-column prop="updateTime" label="更新时间" :formatter="handleFormatter" width="200px" />
                <el-table-column label="操作" width="200px" fixed="right">
                  <template slot-scope="scope">
                    <span @click="handleEdit(scope.row, scope.$index)" style="
                        margin-left: 10px;
                        cursor: pointer;
                        user-select: none;
                      ">编辑</span>
                    <!-- <span
                      @click="handleRemove(scope.$index)"
                      style="
                        color: #F56C6C;
                        margin-left: 10px;
                        cursor: pointer;
                        user-select: none;
                      "
                    >删除</span>-->
                  </template>
                </el-table-column>
              </el-table>
              <div class="fenye_div">
                <el-pagination background :current-page="currentPage" :page-sizes="[10, 20, 30, 40, 50, 60]"
                  :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="RTUList.length"
                  @size-change="handleSizeChange" @current-change="handleCurrentChange" />
              </div>
            </div>
          </div>
        </div>
      </el-tab-pane>
    </el-tabs>
    <el-drawer :wrapperClosable="false" size="80%" title="编辑网关" :visible.sync="drawerOne"
      :close-on-press-escape="false">
      <div style="box-sizing: border-box;padding: 50px;padding-top: 20px;overflow: hidden;height: 100%;height: 860px;">
        <el-form :model="infoDTUForm" :rules="DTURules" ref="DTUForm" label-width="180px" class="demo-ruleForm">
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="网关ID：" prop="uuid">
                <el-input v-model="infoDTUForm.uuid" clearable disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="网关名称：" prop="dtuName">
                <el-input v-model="infoDTUForm.dtuName" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="网关索引：" prop="dtuIndex">
                <el-input v-model="infoDTUForm.dtuIndex" clearable disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="射频信道：" prop="rfChannel">
                <el-input v-model="infoDTUForm.rfChannel" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="DHCP功能：" prop="dhcpEnable">
                <!-- <el-input v-model="infoDTUForm.dhcpEnable" clearable></el-input> -->
                <el-select v-model="infoDTUForm.dhcpEnable" style="width: 100%;">
                  <el-option :value="1" label="开启"></el-option>
                  <el-option :value="0" label="关闭"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="DHCP-IP：" prop="localIp">
                <el-input v-model="infoDTUForm.localIp" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="网关IP：" prop="gatewayIp">
                <el-input v-model="infoDTUForm.gatewayIp" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="子网掩码：" prop="mask">
                <el-input v-model="infoDTUForm.mask" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="服务器IP：" prop="serverIp">
                <el-input v-model="infoDTUForm.serverIp" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="服务器端口号：" prop="serverPort">
                <el-input v-model="infoDTUForm.serverPort" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="RS485 1号端口波特率：" prop="rs485Band1">
                <el-input v-model="infoDTUForm.rs485Band1" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="RS485 2号端口波特率：" prop="rs485Band2">
                <el-input v-model="infoDTUForm.rs485Band2" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="433射频通信：" prop="mode433">
                <el-input v-model="infoDTUForm.mode433" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="RS485 1号端口：" prop="rs485Mode1">
                <el-input v-model="infoDTUForm.rs485Mode1" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="RS485 2号端口：" prop="rs485Mode2">
                <el-input v-model="infoDTUForm.rs485Mode2" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="CAN 1号端口：" prop="can1Mode">
                <el-input v-model="infoDTUForm.can1Mode" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="CAN 2号端口：" prop="can2Mode">
                <el-input v-model="infoDTUForm.can2Mode" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="MAC地址：" prop="macAddress">
                <el-input v-model="infoDTUForm.macAddress" clearable></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="固件版本：" prop="firmwareVersion">
                <el-input v-model="infoDTUForm.firmwareVersion" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">

            </el-col>
          </el-row>
        </el-form>
        <div class="btn">
          <el-button style="width: 120px;margin-left: 20px;" @click="drawerOne = false">取 消</el-button>
          <el-button type="primary" style="width: 120px;margin-left: 50px;" @click="drawerHandleEnter">确 定</el-button>
        </div>
      </div>
    </el-drawer>
    <el-drawer :wrapperClosable="false" size="35%" :title="infoTitle" :visible.sync="isShow"
      :close-on-press-escape="false">
      <div style="box-sizing: border-box;padding-top: 20px;overflow: hidden;height: 100%;height: 860px;">
        <div style="box-sizing: border-box;padding: 20px;overflow-y: scroll;height: 85vh;">
          <el-form :model="infoForm" :rules="RTURules" ref="RTUForm" label-width="120px" class="demo-ruleForm">
            <el-form-item label="网关ID：" prop="uuid">
              <el-input v-model="infoForm.uuid" clearable disabled></el-input>
            </el-form-item>
            <el-form-item label="传感器索引：" prop="rtuIndex">
              <el-input v-model="infoForm.rtuIndex" clearable disabled></el-input>
            </el-form-item>
            <el-form-item label="传感器名称：" prop="rtuName">
              <el-input v-model="infoForm.rtuName" clearable></el-input>
            </el-form-item>
            <el-form-item label="射频信道：" prop="rfChannel">
              <el-input v-model="infoForm.rfChannel" clearable disabled></el-input>
            </el-form-item>
            <el-form-item label="休眠模式：" prop="sleepMode">
              <el-input v-model="infoForm.sleepMode" clearable disabled></el-input>
            </el-form-item>
            <div style="padding: 20px 0;">
              <el-divider content-position="left">X轴</el-divider>
            </div>
            <el-form-item label="总量程">
              <el-input disabled v-model="xTotalRange" oninput="value=value.replace(/^([0-9-]\d*\.?\d{0,2})?.*$/,'$1')"
                clearable></el-input>
            </el-form-item>
            <el-form-item label="正向量程" prop="xThresholdPositive">
              <el-input v-model="infoForm.xThresholdPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向量程" prop="xThresholdNegative">
              <!-- <el-input v-model="infoForm.xThresholdNegative" @blur="handleChange" clearable></el-input> -->
              <el-input v-model="infoForm.xThresholdNegative" clearable></el-input>
            </el-form-item>
            <el-form-item label="正向阈值" prop="xWarningPositive">
              <el-input v-model="infoForm.xWarningPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向阈值" prop="xWarningNegative">
              <el-input v-model="infoForm.xWarningNegative" clearable></el-input>
            </el-form-item>
            <el-form-item label="膨胀方向" prop="xDirection">
              <el-select v-model="infoForm.xDirection" clearable style="width: 100%;">
                <el-option label="正" :value="1"></el-option>
                <el-option label="反" :value="0"></el-option>
              </el-select>
            </el-form-item>
            <div style="padding: 20px 0;">
              <el-divider content-position="left">Y轴</el-divider>
            </div>
            <el-form-item label="总量程">
              <el-input disabled v-model="yTotalRange" oninput="value=value.replace(/^([0-9-]\d*\.?\d{0,2})?.*$/,'$1')"
                clearable></el-input>
            </el-form-item>
            <el-form-item label="正向量程" prop="yThresholdPositive">
              <el-input v-model="infoForm.yThresholdPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向量程" prop="yThresholdNegative">
              <el-input v-model="infoForm.yThresholdNegative" @blur="handleChange" clearable></el-input>
            </el-form-item>
            <el-form-item label="正向阈值" prop="yWarningPositive">
              <el-input v-model="infoForm.yWarningPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向阈值" prop="yWarningNegative">
              <el-input v-model="infoForm.yWarningNegative" clearable></el-input>
            </el-form-item>
            <el-form-item label="膨胀方向" prop="yDirection">
              <el-select v-model="infoForm.yDirection" clearable style="width: 100%;">
                <el-option label="正" :value="1"></el-option>
                <el-option label="反" :value="0"></el-option>
              </el-select>
            </el-form-item>
            <div style="padding: 20px 0;">
              <el-divider content-position="left">Z轴</el-divider>
            </div>
            <el-form-item label="总量程">
              <el-input disabled v-model="zTotalRange" oninput="value=value.replace(/^([0-9-]\d*\.?\d{0,2})?.*$/,'$1')"
                clearable></el-input>
            </el-form-item>
            <el-form-item label="正向量程" prop="zThresholdPositive">
              <el-input v-model="infoForm.zThresholdPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向量程" prop="zThresholdNegative">
              <el-input v-model="infoForm.zThresholdNegative" @blur="handleChange" clearable></el-input>
            </el-form-item>
            <el-form-item label="正向阈值" prop="zWarningPositive">
              <el-input v-model="infoForm.zWarningPositive" clearable></el-input>
            </el-form-item>
            <el-form-item label="反向阈值" prop="zWarningNegative">
              <el-input v-model="infoForm.zWarningNegative" clearable></el-input>
            </el-form-item>
            <el-form-item label="膨胀方向" prop="zDirection">
              <el-select v-model="infoForm.zDirection" clearable style="width: 100%;">
                <el-option label="正" :value="1"></el-option>
                <el-option label="反" :value="0"></el-option>
              </el-select>
            </el-form-item>
            <!-- <el-row :gutter="24">
            <el-col :span="12">
              <el-form-item label="休眠模式：" prop="sleepMode">
                <el-input v-model="infoForm.sleepMode" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">

            </el-col>
          </el-row> -->
          </el-form>
          <div class="btn">
            <el-button style="width: 120px;margin-left: 20px;" @click="isShow = false">取 消</el-button>
            <el-button type="primary" style="width: 120px;margin-left: 50px;" @click="handleEnter">确 定</el-button>
          </div>
        </div>
      </div>
    </el-drawer>
  </div>
</template>

<script>
  import AlarmVisualizationConfiguration from "@/components/AlarmVisualizationConfiguration";
  import SingleAlarmVisualizationConfiguration from "@/components/SingleAlarmVisualizationConfiguration";
  import { getRtuConfig, getDtuConfig, setDTUConfigToDevice, setRTUConfigToDevice } from "@/api/config";
  import { getManagerDTUInfo, getManagerDTUOnlineStatus, getManagerRTUInfo, getManagerRTUOnLineIndexList } from "@/api/manager";

  export default {
    components: {
      AlarmVisualizationConfiguration,
      SingleAlarmVisualizationConfiguration
    },
    data() {
      var forwardRangeValidator = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入正向量程"));
        } else if (Number(value) == Number(this.infoForm.totalRange)) {
          callback(new Error("正向量程不能等于总量程"));
        } else if (Number(value) > Number(this.infoForm.totalRange)) {
          callback(new Error("正向量程不能大于总量程"));
        } else {
          callback();
        }
      };
      var reverseRangeValidator = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入反向量程"));
        } else if (value == 0) {
          callback(new Error("反向量程不能为0"));
        } else if (value > 0) {
          callback(new Error("反向量程不能大于0"));
        } else if (Number(this.infoForm.totalRange) + Number(value) < 0) {
          callback(new Error("反向量程不能大于总量程"));
        } else if (Number(this.infoForm.totalRange) + Number(value) == 0) {
          callback(new Error("反向量程不能等于总量程"));
        } else if (Number(this.infoForm.reverseThreshold) < Number(value)) {
          callback(new Error("反向量程不能小于反向阈值"));
        } else if (Number(this.infoForm.reverseThreshold) == Number(value)) {
          callback(new Error("反向量程不能等于反向阈值"));
        } else {
          callback();
        }
      };
      var totalRangeValidator = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入正向量程"));
        } else if (Number(value) == 0) {
          callback(new Error("总量程不能为0"));
        } else if (Number(value) < 0) {
          callback(new Error("总量程不能小于0"));
        } else {
          callback();
        }
      };
      var forwardThresholdValidator = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入正向阈值"));
        } else if (Number(value) == 0) {
          callback(new Error("正向阈值不能为0"));
        } else if (Number(value) < 0) {
          callback(new Error("正向阈值不能小于0"));
        } else if (Number(value) == Number(this.infoForm.forwardRange)) {
          callback(new Error("正向阈值不能等于正向量程"));
        } else if (Number(value) > Number(this.infoForm.forwardRange)) {
          callback(new Error("正向阈值不能大于正向量程"));
        } else {
          callback();
        }
      };
      var reverseThresholdValidator = (rule, value, callback) => {
        if (value === "") {
          callback(new Error("请输入反向阈值"));
        } else if (Number(value) == 0) {
          callback(new Error("反向阈值不能为0"));
        } else if (Number(value) > 0) {
          callback(new Error("反向阈值不能大于0"));
        } else if (Number(value) == Number(this.infoForm.reverseRange)) {
          callback(new Error("反向阈值不能等于反向量程"));
        } else if (Number(value) < Number(this.infoForm.reverseRange)) {
          callback(new Error("反向阈值不能大于反向量程"));
        } else {
          callback();
        }
      };
      return {
        pageSize: 60,
        loading: false,
        RTUIndexOnLineList: [],
        multiSelectedGroups: [],
        drawerOne: false,
        echartsTitle: "",
        echartsTitleArr: [],
        one: "",
        three: "",
        three2: "",
        uuid: "",
        currentPage: 1,
        isAdd: true,
        DTUOnlineList: [],
        DTUList: [],
        index: 0,
        drawer: false,
        title: "详情",
        two: "",
        myTitle: "新增字典值",
        RTUList: [],
        filterTableData: [],
        infoForm: {},
        infoDTUForm: {
          uuid: 1,
          dtuName: "1号网关",
          dtuIndex: "1",
          rfChannel: 0,
          dhcpEnable: "800",
          localIp: "0",
          gatewayIp: "0",
          mask: "0",
          serverIp: "0",
          serverPort: "0",
          rs485Band1: "0",
          rs485Band2: "0",
          mode433: "0",
          rs485Mode1: "0",
          rs485Mode2: "0",
          can1Mode: "0",
          can2Mode: "0",
          macAddress: "0",
          firmwareVersion: "1.0",
        },
        isShow: false,
        infoTitle: "编辑",
        // DTU配置校验
        DTURules: {
          // 网关名称
          dtuName: [
            { required: true, message: "请输入网关名称", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 32) {
                  callback(new Error("网关名称不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 射频信道
          rfChannel: [
            { required: true, message: "请输入射频信道", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value < 0 || value > 15) {
                  callback(new Error("射频信道不能超过0-15的范围"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // DHCP功能
          dhcpEnable: [
            { required: true, message: "请选择DHCP功能", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("DHCP功能不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // DHCP-IP
          localIp: [
            { required: true, message: "请输入DHCP-IP", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (!/^(\d{1,3}\.){3}\d{1,3}$/.test(value)) {
                  callback(new Error("请输入正确的DHCP-IP格式"));
                } else {
                  callback();
                }
                //  else if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
                //   callback(new Error("DHCP-IP不能超出硬件存储限度"));
                // }
              }, trigger: "blur"
            }
          ],
          // 网关IP
          gatewayIp: [
            { required: true, message: "请输入网关IP", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (!/^(\d{1,3}\.){3}\d{1,3}$/.test(value)) {
                  callback(new Error("请输入正确的网关IP格式"));
                } else {
                  callback();
                }
                // else if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
                //   callback(new Error("网关IP不能超出硬件存储限度"));
                // }
              }, trigger: "blur"
            }
          ],
          // 子网掩码
          mask: [
            { required: true, message: "请输入子网掩码", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
            //       callback(new Error("子网掩码不能超出硬件存储限度"));
            //     }
            //   }, trigger: "blur"
            // }
          ],
          // 服务器IP
          serverIp: [
            { required: true, message: "请输入服务器IP", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (!/^(\d{1,3}\.){3}\d{1,3}$/.test(value)) {
                  callback(new Error("请输入正确的服务器IP格式"));
                } else {
                  callback();
                }
                // else if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
                //   callback(new Error("服务器IP不能超出硬件存储限度"));
                // }
              }, trigger: "blur"
            }
          ],
          // 服务器端口号
          serverPort: [
            { required: true, message: "请输入服务器端口号", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     // if (String(value).replace(/[^x00-xFF]/g, '**').length > 2) {
            //     //   callback(new Error("服务器端口号不能超出硬件存储限度"));
            //     // }
            //   }, trigger: "blur"
            // }
          ],
          // RS485 1号端口波特率
          rs485Band1: [
            { required: true, message: "请输入RS485 1号端口波特率", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     // if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
            //     //   callback(new Error("RS485 1号端口波特率不能超出硬件存储限度"));
            //     // }
            //   }, trigger: "blur"
            // }
          ],
          // RS485 2号端口波特率
          rs485Band2: [
            { required: true, message: "请输入RS485 2号端口波特率", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     // if (String(value).replace(/[^x00-xFF]/g, '**').length > 4) {
            //     //   callback(new Error("RS485 2号端口波特率不能超出硬件存储限度"));
            //     // }
            //   }, trigger: "blur"
            // }
          ],
          // 433射频通信
          mode433: [
            { required: true, message: "请输入433射频通信", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("433射频通信不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // RS485 1号端口
          rs485Mode1: [
            { required: true, message: "请输入RS485 1号端口", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("RS485 1号端口不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // RS485 2号端口
          rs485Mode2: [
            { required: true, message: "请输入RS485 2号端口", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("RS485 2号端口不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // CAN 1号端口
          can1Mode: [
            { required: true, message: "请输入CAN 1号端口", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("CAN 1号端口不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // CAN 2号端口
          can2Mode: [
            { required: true, message: "请输入CAN 2号端口", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 1) {
                  callback(new Error("CAN 2号端口不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // MAC地址
          macAddress: [
            { required: true, message: "请输入MAC地址", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     // if (value.replace(/[^x00-xFF]/g, '**').length > 6) {
            //     //   callback(new Error("MAC地址不能超出硬件存储限度"));
            //     // }
            //   }, trigger: "blur"
            // }
          ],
          // 固件版本
          firmwareVersion: [
            { required: true, message: "请输入固件版本", trigger: "blur" },
            // {
            //   validator: (rule, value, callback) => {
            //     // if (String(value).replace(/[^x00-xFF]/g, '**').length > 16) {
            //     //   callback(new Error("固件版本不能超出硬件存储限度"));
            //     // }
            //   }, trigger: "blur"
            // }
          ]
        },


        // RTU配置校验
        RTURules: {
          // 传感器名称
          rtuName: [
            { required: true, message: "请输入传感器名称", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (String(value).replace(/[^x00-xFF]/g, '**').length > 32) {
                  callback(new Error("传感器名称不能超出硬件存储限度"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 正向阈值
          xWarningPositive: [
            { required: true, message: "请输入正向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value < 0) {
                  callback(new Error("正向阈值不能小于0"));
                } else if (Number(value) >= Number(this.infoForm.xThresholdPositive)) {
                  callback(new Error("正向阈值不能大于等于正向量程"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          yWarningPositive: [
            { required: true, message: "请输入正向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value < 0) {
                  callback(new Error("正向阈值不能小于0"));
                } else if (Number(value) >= Number(this.infoForm.yThresholdPositive)) {
                  callback(new Error("正向阈值不能大于等于正向量程"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          zWarningPositive: [
            { required: true, message: "请输入正向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value < 0) {
                  callback(new Error("正向阈值不能小于0"));
                } else if (Number(value) >= Number(this.infoForm.zThresholdPositive)) {
                  callback(new Error("正向阈值不能大于等于正向量程"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 反向阈值
          xWarningNegative: [
            { required: true, message: "请输入反向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向阈值不能大于0"));
                } else if (Number(value) <= Number(this.infoForm.xThresholdNegative)) {
                  callback(new Error("反向阈值不能大于等于反向量程"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          yWarningNegative: [
            { required: true, message: "请输入反向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向阈值不能大于0"));
                } else if (Number(value) <= Number(this.infoForm.yThresholdNegative)) {
                  callback(new Error("反向阈值不能大于等于反向量程"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          zWarningNegative: [
            { required: true, message: "请输入反向阈值", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向阈值不能大于0"));
                } else if (Number(value) <= Number(this.infoForm.zThresholdNegative)) {
                  callback(new Error("反向阈值不能大于等于反向量程"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向阈值不能为小数"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 正向量程
          xThresholdPositive: [
            { required: true, message: "请输入正向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                console.log("正反量程之和", value + Math.abs(this.infoForm.xThresholdNegative));
                console.log("总量程", this.infoForm.xTotalRange);
                if (value < 0) {
                  callback(new Error("正向量程不能小于0"));
                } else if (Number(value) < Number(this.infoForm.xWarningPositive)) {
                  callback(new Error("正向量程不能小于正向阈值"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向量程不能为小数"));
                } else if (Number(value) + Number(Math.abs(this.infoForm.xThresholdNegative)) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          yThresholdPositive: [
            { required: true, message: "请输入正向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                console.log("正反量程之和", value + Math.abs(this.infoForm.yThresholdNegative));
                console.log("总量程", this.infoForm.yTotalRange);
                if (value < 0) {
                  callback(new Error("正向量程不能小于0"));
                } else if (Number(value) < Number(this.infoForm.yWarningPositive)) {
                  callback(new Error("正向量程不能小于正向阈值"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向量程不能为小数"));
                } else if (Number(value) + Number(Math.abs(this.infoForm.yThresholdNegative)) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          zThresholdPositive: [
            { required: true, message: "请输入正向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                console.log("正反量程之和", value + Math.abs(this.infoForm.zThresholdNegative));
                console.log("总量程", this.infoForm.zTotalRange);
                if (value < 0) {
                  callback(new Error("正向量程不能小于0"));
                } else if (Number(value) < Number(this.infoForm.zWarningPositive)) {
                  callback(new Error("正向量程不能小于正向阈值"));
                } else if (!/^\d+$/.test(value)) {
                  callback(new Error("正向量程不能为小数"));
                } else if (Number(value) + Number(Math.abs(this.infoForm.zThresholdNegative)) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 反向量程
          xThresholdNegative: [
            { required: true, message: "请输入反向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向量程不能大于0"));
                } else if (Number(value) > Math.abs(Number(this.infoForm.xWarningNegative))) {
                  callback(new Error("反向量程不能小于反向阈值"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向量程不能为小数"));
                } else if (Number(Math.abs(value)) + Number(this.infoForm.xThresholdPositive) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          yThresholdNegative: [
            { required: true, message: "请输入反向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向量程不能大于0"));
                } else if (Number(value) > Math.abs(Number(this.infoForm.yWarningNegative))) {
                  callback(new Error("反向量程不能小于反向阈值"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向量程不能为小数"));
                } else if (Number(Math.abs(value)) + Number(this.infoForm.yThresholdPositive) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          zThresholdNegative: [
            { required: true, message: "请输入反向量程", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value > 0) {
                  callback(new Error("反向量程不能大于0"));
                } else if (Number(value) > Math.abs(Number(this.infoForm.zWarningNegative))) {
                  callback(new Error("反向量程不能小于反向阈值"));
                } else if (!/^\d+$/.test(Math.abs(value))) {
                  callback(new Error("反向量程不能为小数"));
                } else if (Number(Math.abs(value)) + Number(this.infoForm.zThresholdPositive) > 850) {
                  callback(new Error("总量程不能大于850"));
                } else {
                  callback();
                }
              }, trigger: "blur"
            }
          ],
          // 休眠模式
          sleepMode: [
            { required: true, message: "请输入休眠模式", trigger: "blur" },
            {
              validator: (rule, value, callback) => {
                if (value < 0 || value > 4) {
                  callback(new Error("休眠模式不能超过0-4的范围"));
                } {
                  callback();
                }
              },
              trigger: "blur"
            }
          ],
          // // 总量程
          // totalRange: [
          //   { required: true, message: "请输入总量程", trigger: "blur" },
          //   {
          //     validator: (rule, value, callback) => {
          //       if (Number(value) < 0) {
          //         callback(new Error("总量程不能小于0"));
          //       } else if (Number(value) > 1000) {
          //         callback(new Error("总量程不能大于1000"));
          //       } else if (Number(value) < Number(this.infoForm.warningPositive)) {
          //         callback(new Error("总量程不能小于正向阈值"));
          //       } else {
          //         callback();
          //       }
          //     },
          //     trigger: "blur"
          //   }
          // ]
        },
        infoRules: {
          parentName: [
            { required: true, message: "请输入锅炉名称", trigger: "blur" }
          ],
          name: [
            { required: true, message: "请输入传感器名称", trigger: "blur" }
          ],
          totalRange: [
            { required: true, message: "请输入总量程", trigger: "blur" },
            { validator: totalRangeValidator, trigger: "blur" }
          ],
          forwardRange: [
            { required: true, message: "请输入正向量程", trigger: "blur" },
            { validator: forwardRangeValidator, trigger: "blur" }
          ],
          reverseRange: [
            { required: true, message: "请输入反向量程", trigger: "blur" },
            { validator: reverseRangeValidator, trigger: "blur" }
          ],
          forwardThreshold: [
            { required: true, message: "请输正向阈值", trigger: "blur" },
            { validator: forwardThresholdValidator, trigger: "blur" }
          ],
          reverseThreshold: [
            { required: true, message: "请输反向阈值", trigger: "blur" },
            { validator: reverseThresholdValidator, trigger: "blur" }
          ]
        }
      };
    },
    async created() {
      // 全部DTU是否在线
      await this.getManagerDTUOnlineStatus();
      this.uuid = this.DTUOnlineList[0].uuid;
      await this.getManagerRTUOnLineIndexList();
    },
    computed: {
      xTotalRange() {
        return Number(this.infoForm.xThresholdPositive) + Number(Math.abs(this.infoForm.xThresholdNegative))
      },
      yTotalRange() {
        return Number(this.infoForm.yThresholdPositive) + Number(Math.abs(this.infoForm.yThresholdNegative))
      },
      zTotalRange() {
        return Number(this.infoForm.zThresholdPositive) + Number(Math.abs(this.infoForm.zThresholdNegative))
      },
    },
    methods: {
      // 获取在线状态RTU 返回RTU索引集合
      async getManagerRTUOnLineIndexList() {
        try {
          const { result, message, code } = await getManagerRTUOnLineIndexList(this.uuid);
          if (code == 0) {
            this.RTUIndexOnLineList = result.online;
            this.RTUIndexOnLineList.sort((a, b) => Number(b) - Number(a));
            this.RTUList.sort((i, j) => this.RTUIndexOnLineList.indexOf(i.rtuIndex) < this.RTUIndexOnLineList.indexOf(j.rtuIndex) ? 1 : -1);
            this.RTUList.sort((i, j) => {
              if (this.RTUIndexOnLineList.indexOf(i.rtuIndex) == -1 && this.RTUIndexOnLineList.indexOf(j.rtuIndex) == -1) {
                return i.rtuIndex - j.rtuIndex;
              }
            })
            this.$nextTick(() => {
              this.loading = false;
            })
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 获取指定RTU配置
      async getRtuConfig(info) {
        try {
          const { result, message, code } = await getRtuConfig(info);
          if (code == 0) {
            console.log("result", result);
            const indexRTUInfo = result;
            const { xDirection, yDirection, zDirection } = indexRTUInfo
            const cc = indexRTUInfo
            this.infoForm = {
              uuid: indexRTUInfo.uuid,
              rtuIndex: indexRTUInfo.rtuIndex,
              // dtuName: this.DTUList.filter(item => item.uuid == this.uuid)[0].name,
              rtuName: indexRTUInfo.rtuName,
              // X轴
              // xTotalRange: indexRTUInfo.measuringThreshold.xThresholdPositive +
              //   Math.abs(indexRTUInfo.measuringThreshold.xThresholdNegative),
              xThresholdPositive: xDirection == 1 ? cc.xThresholdPositive : cc.xRangePositive,
              xThresholdNegative: xDirection == 1 ? cc.xRangeNegative : cc.xThresholdNegative,
              xWarningPositive: xDirection == 1 ? cc.xWarningPositive : cc.xThresholdPositive,
              xWarningNegative: xDirection == 1 ? cc.xThresholdNegative : cc.xWarningNegative,
              // xRangePositive: xDirection == 1 ? cc.xThresholdPositive : cc.xRangePositive,
              xDirection: xDirection,
              // Y轴
              // yTotalRange: indexRTUInfo.measuringThreshold.yThresholdPositive +
              //   Math.abs(indexRTUInfo.measuringThreshold.yThresholdNegative),
              yThresholdPositive: yDirection == 1 ? cc.yThresholdPositive : cc.yRangePositive,
              yThresholdNegative: yDirection == 1 ? cc.yRangeNegative : cc.yThresholdNegative,
              yWarningPositive: yDirection == 1 ? cc.yWarningPositive : cc.yThresholdPositive,
              yWarningNegative: yDirection == 1 ? cc.yThresholdNegative : cc.yWarningNegative,
              yDirection: yDirection,
              // Z轴
              // zTotalRange: indexRTUInfo.measuringThreshold.zThresholdPositive +
              //   Math.abs(indexRTUInfo.measuringThreshold.zThresholdNegative),
              zThresholdPositive: zDirection == 1 ? cc.zThresholdPositive : cc.zRangePositive,
              zThresholdNegative: zDirection == 1 ? cc.zRangeNegative : cc.zThresholdNegative,
              zWarningPositive: zDirection == 1 ? cc.zWarningPositive : cc.zThresholdPositive,
              zWarningNegative: zDirection == 1 ? cc.zThresholdNegative : cc.zWarningNegative,
              zDirection: zDirection,
              rfChannel: cc.rfChannel,
              sleepMode: cc.sleepMode,
            };
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 更新指定RTU配置
      async setRTUConfigToDevice() {
        try {
          const { xDirection, yDirection, zDirection } = this.infoForm
          const info = {
            uuid: this.infoForm.uuid,
            rtuIndex: this.infoForm.rtuIndex,
            rfChannel: 1,
            sleepMode: 0,
            rtuName: this.infoForm.rtuName,
            reserved: 0,
            // totalRange: Number(this.infoForm.totalRange),
            // thresholdPositive: Number(this.infoForm.thresholdPositive),
            // thresholdNegative: Number(this.infoForm.thresholdNegative),
            // warningPositive: Number(this.infoForm.warningPositive),
            // warningNegative: Number(this.infoForm.warningNegative),
            xDirection: xDirection,
            yDirection: yDirection,
            zDirection: zDirection,

            // xRangePositive: xDirection == 1 ? 0 : this.infoForm.xThresholdPositive,
            // xRangeNegative: xDirection == 1 ? this.infoForm.xThresholdNegative : 0,
            xRangePositive: this.infoForm.xThresholdPositive,
            xRangeNegative: this.infoForm.xThresholdNegative,
            xWarningPositive: xDirection == 1 ? this.infoForm.xWarningPositive : 0.1,
            xWarningNegative: xDirection == 1 ? -0.1 : this.infoForm.xWarningNegative,
            xThresholdPositive: xDirection == 1 ? this.infoForm.xThresholdPositive : this.infoForm.xWarningPositive,
            xThresholdNegative: xDirection == 1 ? this.infoForm.xWarningNegative : this.infoForm.xThresholdNegative,

            // yRangePositive: yDirection == 1 ? 0 : this.infoForm.yThresholdPositive,
            // yRangeNegative: yDirection == 1 ? this.infoForm.yThresholdNegative : 0,
            yRangePositive: this.infoForm.yThresholdPositive,
            yRangeNegative: this.infoForm.yThresholdNegative,
            yWarningPositive: yDirection == 1 ? this.infoForm.yWarningPositive : 0.1,
            yWarningNegative: yDirection == 1 ? -0.1 : this.infoForm.yWarningNegative,
            yThresholdPositive: yDirection == 1 ? this.infoForm.yThresholdPositive : this.infoForm.yWarningPositive,
            yThresholdNegative: yDirection == 1 ? this.infoForm.yWarningNegative : this.infoForm.yThresholdNegative,

            // zRangePositive: zDirection == 1 ? 0 : this.infoForm.zThresholdPositive,
            // zRangeNegative: zDirection == 1 ? this.infoForm.zThresholdNegative : 0,
            zRangePositive: this.infoForm.zThresholdPositive,
            zRangeNegative: this.infoForm.zThresholdNegative,
            zWarningPositive: zDirection == 1 ? this.infoForm.zWarningPositive : 0.1,
            zWarningNegative: zDirection == 1 ? -0.1 : this.infoForm.zWarningNegative,
            zThresholdPositive: zDirection == 1 ? this.infoForm.zThresholdPositive : this.infoForm.zWarningPositive,
            zThresholdNegative: zDirection == 1 ? this.infoForm.zWarningNegative : this.infoForm.zThresholdNegative,
          };

          const { result, message, code } = await setRTUConfigToDevice(info);
          if (code == 0) {
            await this.getManagerDTUOnlineStatus();
            this.$message.success("修改成功");
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 更新指定DTU配置
      async setDTUConfigToDevice() {
        try {
          const { result, message, code } = await setDTUConfigToDevice(this.infoDTUForm);
          if (code == 0) {
            this.$message.success(message);
            this.getManagerDTUOnlineStatus();
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 获取指定DTU配置
      async getDtuConfig() {
        try {
          const { result, message, code } = await getDtuConfig(this.uuid);
          if (code == 0) {
            console.log("DTU设备配置信息", result);
            this.$message.success(message);
            this.infoDTUForm = result;
            this.infoDTUForm.dhcpEnable = this.infoDTUForm.dhcpEnable ? 1 : 0;
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      handleFormatter(row) {
        return `${new Date(row.updateTime).getFullYear()}-${new Date(row.updateTime).getMonth() + 1}-${new Date(row.updateTime).getDate()} ${new Date(row.updateTime).getHours()}:${new Date(row.updateTime).getMinutes() < 10 ? "0" + new Date(row.updateTime).getMinutes() : new Date(row.updateTime).getMinutes()}`;
      },
      // 获取指定DTU所属全部RTU
      async getManagerRTUInfo() {
        try {
          const { result: { data }, message, code } = await getManagerRTUInfo(this.uuid);
          if (code == 0) {
            this.RTUList = data;
            this.loading = false;
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 获取DTU在线状态
      async getManagerDTUOnlineStatus() {
        try {
          this.loading = true;
          const { result, message, code } = await getManagerDTUOnlineStatus();
          if (code == 0) {
            this.DTUOnlineList = result.filter(item => item.online);
            this.getManagerDTUInfo();
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      // 获取全部DTU信息
      async getManagerDTUInfo() {
        try {
          const { result: { data }, message, code } = await getManagerDTUInfo();
          const list = [];
          if (code == 0) {
            for (let i = 0; i < this.DTUOnlineList.length; i++) {
              const onLineUuid = this.DTUOnlineList[i].uuid;
              for (let j = 0; j < data.length; j++) {
                if (data[j].uuid == onLineUuid) {
                  list.push(data[j]);
                }
              }
            }
            this.DTUList = list;
            this.handleClick();
          }
        } catch (err) {
          console.log("调用接口报错了", err);
        }
      },
      handleDTUClick() {
        this.drawerOne = true;
        this.getDtuConfig();
      },
      drawerHandleEnter() {
        this.$refs.DTUForm.validate(valid => {
          console.log("1111222333");
          console.log("aaaa", valid);
          if (valid) {
            console.log("走进来了");
            this.setDTUConfigToDevice();
            this.drawerOne = false;
          } else {
            console.log("error submit!!");
            return false;
          }
        });

      },
      tcpClient() {
        const net = require("net");
        console.log('net', net);
        const client = net.createConnection({
          port: 2131, // 端口需要和服务端保持一致
          host: 'http://xxxx' //服务端的ip地址
        });
        client.setEncoding('utf8');
        //当套字节与服务端连接成功时触发connect事件
        client.on('connect', () => {
          client.write('消息');//向服务端发送数据
        });
        client.on('data', function (data) {
          console.log(data, '服务端发送的消息')
        })
        client.on('error', function (err) {
          console.log('连接失败')
          client.destroy();
        })
      },
      // 全选
      handleSelectAll() {
        if (this.activeName == "first") {
          this.$refs.multipleTable.clearSelection();
        } else {
          this.$refs.multipleTable2.clearSelection();
        }
      },
      // 查看
      handleChakan() {
        if (this.echartsTitleArr.length == 0) {
          this.$message("请选择");
          return;
        }
        if (this.echartsTitleArr.length == 1) {
          this.$message("双击当前行，即可查看");
          return;
        }
        this.drawer = true;
      },
      // 回调表格选择的数据 当选择项发生变化时会触发该事件
      handleSelectionChange(list) {
        if (list.length > 3) {
          this.limitFn(list);
          return;
        }
        this.multiSelectedGroups = [...list];
        this.echartsTitleArr = list.map(item => item.name);
      },
      // 限制数量方法
      limitFn(list) {
        if (this.activeName == "first") {
          this.$refs.multipleTable.clearSelection(); //用于多选表格，清空用户的选择
          for (let i = 0; i < 3; i++) {
            this.$refs.multipleTable.toggleRowSelection(list[i]); //用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）
          }
        } else {
          this.$refs.multipleTable2.clearSelection(); //用于多选表格，清空用户的选择
          for (let i = 0; i < 3; i++) {
            this.$refs.multipleTable2.toggleRowSelection(list[i]); //用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）
          }
        }
      },
      handleView(title) {
        this.drawerOne = true;
        this.echartsTitle = title;
      },
      handleChange() {
        this.infoForm.forwardRange =
          Number(this.infoForm.totalRange) + Number(this.infoForm.reverseRange);
      },
      async handleClick() {
        this.two = "";
        this.loading = true;
        await this.getManagerRTUInfo();
        await this.getManagerRTUOnLineIndexList();
      },
      handleSizeChange(pageSize) {
        this.pageSize = pageSize;
        console.log("当前每页条数", pageSize);
      },
      handleCurrentChange(currentPage) {
        this.currentPage = currentPage;
      },
      handleAdd() {
        this.isAdd = true;
        this.infoTitle = "新增传感器";
        this.infoForm = {
          parentName: this.activeName == "first" ? "1号锅炉" : "2号锅炉",
          name: "",
          totalRange: "",
          forwardRange: "",
          forwardThreshold: 0,
          reverseRange: -100,
          reverseThreshold: -50
        };
        this.isShow = true;
      },
      handleEnter() {
        this.$refs.RTUForm.validate(valid => {
          if (valid) {
            this.setRTUConfigToDevice();
            this.isShow = false;
          } else {
            console.log("error submit!!");
            return false;
          }
        });
      },
      handleEdit(row, idx) {
        this.isAdd = false;
        this.index = idx;
        this.infoTitle = "编辑传感器";
        this.isShow = true;
        const info = {
          dtuUuid: this.uuid,
          rtuIndex: row.rtuIndex + ""
        };
        console.log(info);
        this.getRtuConfig(info);
      },
      handleRowDBClick(row) {
        this.drawerOne = true;
        this.echartsTitle = row.name;
      },
      loadEcharts() {
        this.$nextTick(() => {
          this.initEcharts();
        });
      },
      handleChangeGLName() {
        if (this.one != this.two) {
          this.two = "";
        }
      },
      handleSearch() {
        if (this.activeName == "first") {
          this.filterTableData = this.tableData1.filter(item =>
            item.name.includes(this.two)
          );
        } else {
          this.filterTableData = this.tableData2.filter(item =>
            item.name.includes(this.two)
          );
        }
        if (this.one == 1) {
          this.filterTableData = this.filterTableData.filter(
            item => item.realTime < item.reverseThreshold
          );
        } else if (this.one == 2) {
          this.filterTableData = this.filterTableData.filter(
            item => item.realTime > item.reverseThreshold
          );
        }
      },
      handleReset() {
        this.one = this.two = this.three = "";
        if (this.activeName == "first") {
          this.filterTableData = this.tableData1;
        } else {
          this.filterTableData = this.tableData2;
        }
      },
      handleRemove(idx) {
        this.$confirm("数据删除后将不可恢复，是否继续此操作？", "删除确认", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.$delete(this.filterTableData, idx);
            this.$message({
              type: "success",
              message: "删除成功!"
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      }
    }
  };
</script>

<style lang="scss" scoped>
  .device_setting_div {
    position: relative;

    .dtu_div {
      position: absolute;
      right: 119px;
      z-index: 5;
      font-size: 14px;
      color: #409EFF;
      top: 26px;
      user-select: none;
      cursor: pointer;
    }

    .fenye_div {
      margin-top: 30px;
      text-align: right;
    }

    .table_div {
      height: calc(100vh - 150px);
    }

    .tit_span {
      margin-left: 20px;
      font-weight: 400;
      font-size: 14px;
      color: #909399;
    }

    .top_span2 {
      /** 文本1 */
      font-size: 14px;
      font-weight: 400;
      color: rgba(0, 0, 0, 0.85);
    }

    .sx_top {
      height: 80px;
      background-color: #fff;
      box-sizing: border-box;
      padding: 0 0 29px 19px;
    }

  }

  .btn {
    display: flex;
    justify-content: center;
    margin-top: 100px;
  }

  .ball_div {
    box-sizing: border-box;
    padding: 20px;
    padding-top: 0;
    overflow-y: scroll;
    height: calc(100vh - 77px);
  }

  .red {
    color: #f56c6c;
  }

  .green {
    color: #67c23a;
  }

  .duankai_div {
    width: 230px;
    height: 110px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;

    &>div {
      margin-top: 20px;
      color: #a3afcc;
    }
  }
</style>

<style lang="scss">
  .device_setting_div {

    .el-table td.gutter,
    .el-table th.gutter {
      background-color: rgb(250, 250, 250) !important;
    }

    .el-table__fixed-right-patch {
      background-color: rgb(250, 250, 250) !important;
    }

    .el-table__body-wrapper {
      overflow-x: scroll !important;
    }

    .el-dialog__body {
      padding-top: 0 !important;
      padding-bottom: 0 !important;
    }

    .el-tabs__nav-scroll {
      background-color: #fff;
      padding-left: 34px;
    }

    .content_div {
      height: calc(100vh - 150px);
    }

    .el-tabs__nav-wrap::after {
      background-color: transparent !important;
    }
  }
</style>